{extend name="public:base"}
{block name='css'}
{/block}

{block name='body'}
<div class="view view-main white-navbar white-toolbar">
    <div data-name="home" class="page">

        <div class="navbar">
            <div class="navbar-inner">
                <div class="left"><a href="{$back}" class="external"><i class="iconfont icon-fanhui"></i></a></div>
                <div class="center"><span>修改头像</span></div>
                <div class="right"></div>
            </div>
        </div>

        <div class="page-content padding-bottom50 ">

            <div class="save-img">
                <div class="t"><img src="{:session('user.img')}" class="img"/></div>
                <p class="row segmented-round">
                    <button class="col button button-big button-fill" style="background:#c7c7cc;width:100%;">选择图片</button>
                    <input type="file" class="js-img" />
                </p>
            </div>

        </div>

    </div>
</div>
{/block}

{block name="js"}
<script type="text/javascript">
    $(function(){
        $('.js-img').change(function(event){
            ajaxImgFile('.img','',event);
        });
    });
    /*
     * ajax上传图片
     * @param string imgObj 需要修改img的src属性的对象
     * @param string fileObj 需要修input值的对象
     */
    function ajaxImgFile( imgObj, inputObj, event ){
        app.dialog.preloader('上传中...');
        var files = event.target.files || event.dataTransfer.files;
        var formData = new FormData();
        formData.append('imgFile', files[0]);
        var ajax = new XMLHttpRequest();
        ajax.open("POST", "", true);
        ajax.send(formData);
        ajax.onreadystatechange = function() {
            if (ajax.readyState == 4) {
                if (ajax.status >= 200 && ajax.status < 300 || ajax.status == 304) {
                    var data = JSON.parse(ajax.responseText);
                    if (data.status == 'y') {
                        //修改img为上传后的图片地址
                        if ( imgObj ) {
                            $(imgObj).attr('src',data.data);
                        }
                        //给传值的input赋值
                        if ( inputObj ) {
                            $(inputObj)	.attr('value',data.url);
                        }
                        var toastCenter = app.toast.create({
                            text: data.info,
                            position: 'center',
                            closeTimeout: 2000
                        });
                        toastCenter.open();
                    } else {
                        var toastCenter = app.toast.create({
                            text: data.info,
                            position: 'center',
                            closeTimeout: 2000
                        });
                        toastCenter.open();
                    }
                    app.dialog.close();
                }
            }
        }

    }
</script>
{/block}